<template>
  <div class="card">
    <img :src="imageSrc" class="card-image" alt="Product Image">
    <div class="card-content">
      <h3>产品名称</h3>
      <p>产品描述</p>
      <button @click="goToComments">进入评论区</button>
      <button class="delete-btn" @click="deleteCard">删除</button>
    </div>
  </div>
</template>

<script>
export default {
  props: ['imageSrc', 'onDelete'],
  methods: {
    goToComments() {
      this.$router.push('/page-a'); // 跳转到页面A
    },
    deleteCard() {
      this.onDelete();
    }
  }
}
</script>

<style scoped>
.card {
  /* 卡片样式 */
}
.card-image {
  /* 图片样式 */
}
.delete-btn {
  background-color: red;
  color: white;
  /* 删除按钮样式 */
}
</style>
